<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>定时器</title>
    <script type="text/javascript">
        window.onload = function() {
            // var cnt = document.getElementById("count");
            var count = document.getElementById("count");
            // 获取count中的内容，自动切换
            for(var i = 0; i < 10; i++) {

            }

            /* 
            setInterval()
                - 定时调用
                - 可以将一个函数，每隔一段时间执行一次
                - 参数：
                    1. 回调函数：该函数会每隔一段时间被调用一次
                    2. 每次调用的间隔时间，单位：毫秒ms
                
                - 返回值：
                    返回一个Number类型的数据
                    这个数字用阿里作为定时器的唯一标识
                
                - 在开启一个定时器之前，需要将当前元素上的其他定时器关闭
            */
            var num = 1;
            var timer = setInterval(function(){
                count.innerHTML = num++;
                if(num == 11)
                    clearInterval(timer);
            }, 1000);
            // 用来关闭一个定时器，需要一个定时器的表示作为参数
            /* 
            clearInterval()可以接收任意参数，
                如果参数是一个有效的定时器的标识，则停止对应的定时器
                如果参数不是一个有效的标识，则什么也不做

            */
            // clearInterval(timer);
            // var timer = setInterval(function(){
            //     clearInterval(time);
            // }, 1000);
        }
    </script>
</head>
<body>
    <h1 id="count"></h1>
</body>
</html>
